- var srcAddr = "https://github.com/aktos-io/scada.js/blob/master/apps/example/webapps/showcase/previews/drawing-area.pug"
anchor drawing-area
.ui.segments
    h3.ui.top.attached.block.header Scada Drawing Area #[a(href="#drawing-area") #[i.linkify.icon]]
    .ui.attached.segment 
        btn.basic.teal.label.icon(href=srcAddr newtab) #[i.code.icon] View on Github #[i.github.icon]
    .ui.attached.segment
        drawing-area 
            widget(x="100px" y="100px")
                progress.purple(value="{{progress.one.curr}}" 
                    max="{{progress.one.max}}" 
                    percent="{{progress.one.percent}}"
                    height="200px"
                    width="100px"
                    img="progress/thermometer.svg")

            widget(x="300px" y="300px")
                progress.purple(
                    type="vertical" 
                    value="{{progress.one.curr}}" 
                    max="{{progress.one.max}}"
                    width="100px"
                    height="100px")
            widget(x="200px" y="100px")
                label(format='##.# meter' value="{{progress.one.curr}}")
                    
            widget(x="400px" y="200px" width="250px")
                slider(value="{{progress.one.curr}}" max="{{progress.one.max}}")

            widget(x="250px" y="300px" height="200px")
                slider(vertical value="{{progress.one.curr}}" max="{{progress.one.max}}")
                    
            widget(x="420px" y="40px")
                overlap(width="100px") 
                    img(src="progress/truck.png")
                    +if('showmyoverlay1')
                        img(src="progress/truck-tanker.png")

            widget(x="580px" y="40px")
                checkbox.red(checked="{{showmyoverlay1}}") show/hide red tanker
                
            widget(x="580px" y="350px")
                progress.purple(value="{{progress.one.curr}}" 
                    max="{{progress.one.max}}" 
                    width="200px"
                    height="150px"
                    offset="50"
                    img="progress/truck-tanker.png"
                    background="progress/truck.png")
